{
	draw(stepData,ctx){
		let {step,state} = stepData
		ctx.save()
		ctx.merge(state)
		let fp = step[0]
		let sp = step[1]
		let ep = step[2]

		if(ep){
			this.drawArc(step,ctx)
			this.drawATip(step,ctx)
		}
		this.linend(step,ctx)
		if(ctx.ghost){
			this.drawRTip(step,ctx)
			this.point(fp,ctx)
			this.point(sp,ctx)
			ep&&this.point(ep,ctx)
		}
		ctx.restore()
	},
	drawArc(step,ctx){
		let fp = step[0]
		let sp = step[1]
		let ep = step[2]
		let {x,y} = fp
		let s = Math.tan360(sp.y-y,sp.x-x)
		let e = Math.tan360(ep.y-y,ep.x-x)
		let r = Math.distance(fp,sp)
		this.cArc({
			x,y,s,e,r
		},ctx)
	},
	drawATip(step,ctx){
		let fp = step[0]
		let sp = step[1]
		let ep = step[2]
		let s = Math.tan360(sp.y-fp.y,sp.x-fp.x)
		let e = Math.tan360(ep.y-fp.y,ep.x-fp.x)
		let r = Math.distance(fp,sp)

		ctx.save()
		ctx.fillStyle=ctx.strokeStyle
		ctx.translate(fp.x,fp.y)
		let ta = e>s?(s+e)/2:Math.PI+(s+e)/2
		ctx.rotate(ta);
			ctx.save()
			ctx.textAlign="left"
			ctx.fontSize=this.fontSize
			ctx.translate(20,0)
			let text = `∠${fp.text}`
			ctx.fillText(text,0,0)
			if(ctx.pathMode||ctx.ghost){
				let angle = e>s?(e-s):2*Math.PI-(s-e)
				angle = (angle*180/Math.PI).toFixed(2)
				ctx.save()
				ctx.translate(r-10,0)
				ctx.fillText(`${angle}°`,0,0)
				ctx.restore()
			}	
			ctx.restore()
		ctx.restore()
	}
}